<template>
  <Dialog :title="t('studentHonor.view.title')" v-model="dialogVisible" width="1400">
    <!-- <template v-if="!edit"> -->
    <!--   <el-button -->
    <!--     class="mb-[16px]" -->
    <!--     v-hasPermi="['core:student-honor:update']" -->
    <!--     type="primary" -->
    <!--     plain -->
    <!--     @click="handleEdit" -->
    <!--     :disabled="formLoading" -->
    <!--   > -->
    <!--     <Icon icon="ep:edit" /> -->
    <!--     {{ t('studentHonor.view.clickEdit') }} -->
    <!--   </el-button> -->
    <!--   <el-button -->
    <!--     class="mb-[16px]" -->
    <!--     v-hasPermi="['core:student-honor:audit']" -->
    <!--     type="danger" -->
    <!--     plain -->
    <!--     @click="handleAudit" -->
    <!--     :disabled="formData.reviewStatus !== '待审核' || formLoading" -->
    <!--   > -->
    <!--     <Icon icon="ep:edit" /> -->
    <!--     {{ t('studentHonor.view.clickAudit') }} -->
    <!--   </el-button> -->
    <!-- </template> -->
    <el-descriptions v-loading="formLoading" :column="2" border label-width="150">
      <el-descriptions-item :label="t('studentHonor.fields.studentCode')" width="280">
        <EditInput
          v-model="formData.studentCode"
          :placeholder="t('common.inputTextPlaceholder') + t('studentHonor.fields.studentCode')"
          :disabled="true"
        />
      </el-descriptions-item>
      <el-descriptions-item :label="t('studentHonor.fields.studentName')" width="280">
        <EditInput
          v-model="formData.studentName"
          :placeholder="t('common.inputTextPlaceholder') + t('studentHonor.fields.studentName')"
          :disabled="true"
        />
      </el-descriptions-item>
      <el-descriptions-item :label="t('studentHonor.fields.honorName')" width="280">
        <EditInput
          v-model="formData.honorName"
          :placeholder="t('common.inputTextPlaceholder') + t('studentHonor.fields.honorName')"
        />
      </el-descriptions-item>
      <el-descriptions-item :label="t('studentHonor.fields.honorTime')" width="280">
        <EditDate
          v-model="formData.honorTime"
          :placeholder="t('common.inputTextPlaceholder') + t('studentHonor.fields.honorTime')"
        />
      </el-descriptions-item>
      <el-descriptions-item :label="t('studentHonor.fields.honorType')" width="280">
        <EditDict
          :dict-type="DICT_TYPE.HONOR_TYPE"
          v-model="formData.honorType"
          :placeholder="t('common.selectTextPlaceholder') + t('studentHonor.fields.honorType')"
        />
      </el-descriptions-item>
      <el-descriptions-item :label="t('studentHonor.fields.teamHonor')" width="280">
        <EditDict
          :dict-type="DICT_TYPE.HONOR_TEAM_HONOR"
          v-model="formData.teamHonor"
          :placeholder="t('common.selectTextPlaceholder') + t('studentHonor.fields.teamHonor')"
        />
      </el-descriptions-item>
      <el-descriptions-item :label="t('studentHonor.fields.ranking')" width="280">
        <EditInput
          v-model="formData.ranking"
          :placeholder="t('common.selectTextPlaceholder') + t('studentHonor.fields.ranking')"
        />
      </el-descriptions-item>
      <el-descriptions-item :label="t('studentHonor.fields.mentorName')" width="280">
        <UserSelect
          v-model="formData.mentorId"
          @selected="handleMentorSelected"
          :placeholder="t('common.selectTextPlaceholder') + t('studentHonor.fields.mentorName')"
        />
      </el-descriptions-item>
      <el-descriptions-item :label="t('studentHonor.fields.attachment')" width="280" :span="2">
        <IMRUpload v-model="formData.attachment" :disabled="!edit" />
      </el-descriptions-item>
      <el-descriptions-item :label="t('studentHonor.fields.remark')" width="280" :span="2">
        <EditInput
          v-model="formData.remark"
          type="textarea"
          :rows="3"
          :maxlength="200"
          show-word-limit
          :placeholder="t('common.inputTextPlaceholder') + t('studentHonor.fields.remark')"
        />
      </el-descriptions-item>
      <!-- <el-descriptions-item :label="t('studentHonor.fields.reviewStatus')" width="280"> -->
      <!--   <el-tag v-if="formData.reviewStatus" type="primary">{{ formData.reviewStatus }}</el-tag> -->
      <!-- </el-descriptions-item> -->
      <!-- <el-descriptions-item :label="t('studentHonor.fields.reviewerName')" width="280"> -->
      <!--   <el-tag v-if="formData.reviewerName" type="primary">{{ formData.reviewerName }}</el-tag> -->
      <!-- </el-descriptions-item> -->
      <!-- <el-descriptions-item :label="t('studentHonor.fields.reviewTime')" width="280"> -->
      <!--   {{ formatDate(formData.reviewTime) }} -->
      <!-- </el-descriptions-item> -->
      <!-- <el-descriptions-item :label="t('studentHonor.fields.reviewComments')" width="280"> -->
      <!--   {{ formData.reviewComments }} -->
      <!-- </el-descriptions-item> -->
    </el-descriptions>

    <template v-if="edit" #footer>
      <el-button @click="submitForm" type="primary" :disabled="formLoading"
        >{{ t('common.ok') }}
      </el-button>
      <el-button @click="edit = false">{{ t('common.cancel') }}</el-button>
    </template>
  </Dialog>
  <StudentHonorAudit ref="auditRef" @success="handleAuditFinish" />
</template>
<script setup lang="ts">
import { StudentHonorApi, StudentHonorVO } from '@/api/core/studenthonor'
import EditInput from '@/views/core/ustcstudent/components/input/EditInput.vue'
import EditDate from '@/views/core/ustcstudent/components/input/EditDate.vue'
import EditDict from '@/views/core/ustcstudent/components/input/EditDict.vue'
import { UserVO } from '@/api/system/user'
import { formatDate } from '@/utils/formatTime'
import { DICT_TYPE } from '@/utils/dict'
import UserSelect from '@/views/system/user/components/UserSelect.vue'
import IMRUpload from '@/components/IMRUpload/index.vue'
import StudentHonorAudit from './StudentHonorAudit.vue'

/** 荣誉奖项 表单 */
defineOptions({ name: 'StudentHonorForm' })

const edit = ref(false)
provide('editMode', edit)

const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗

const dialogVisible = ref(false) // 弹窗的是否展示
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formData = ref<Partial<StudentHonorVO>>({})

const auditRef = ref<InstanceType<typeof StudentHonorAudit>>()

/** 打开弹窗 */
const open = async (id: string) => {
  edit.value = false
  dialogVisible.value = true
  formLoading.value = true
  formData.value = {}
  try {
    formData.value = await StudentHonorApi.getStudentHonor(id)
    if (formData.value && !formData.value?.attachment) {
      formData.value.attachment = '[]'
    }
  } finally {
    formLoading.value = false
  }
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗

/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => {
  // 提交请求
  formLoading.value = true
  try {
    const data = formData.value as unknown as StudentHonorVO
    await StudentHonorApi.updateStudentHonor(data)
    message.success(t('common.updateSuccess'))
    edit.value = false
    dialogVisible.value = false
    // 发送操作成功的事件
    emit('success')
  } finally {
    formLoading.value = false
  }
}

const handleEdit = () => {
  edit.value = true
}

const handleAudit = () => {
  auditRef.value?.open(formData.value.id!)
}

const handleMentorSelected = (user: UserVO) => {
  formData.value.mentorId = user.id
  formData.value.mentorCode = user.jobCode
  formData.value.mentorName = user.nickname
}

const handleAuditFinish = () => {
  edit.value = false
  dialogVisible.value = false
  emit('success')
}
</script>
